<template>
  <div class="solar-term" @click="handleClickJ">
    <img :src="recentJSrc" v-if="recentJSrc" alt="" :title="recentJname">
  </div>
</template>

<script>
  export default {
    name: 'solar-term',
    data() {
      return {
        recentJSrc: '',
        recentJname: ''
      }
    },
    mounted() {
      const currentJ = this.getjq()
      if (!currentJ.name) return
      this.recentJSrc = require(`../../assets/imgs/${currentJ.name}.png`)
      this.recentJname = currentJ.name
    },
    methods: {
      handleClickJ() {
        window.open('https://www.sogou.com/web?query=' + this.recentJname)
      },
      getjq() {
        const jqs = ['0105小寒','0120大寒','0203立春','0218雨水','0305惊蜇','0320春分','0404清明','0419谷雨','0505立夏','0520小满','0605芒种','0621夏至','0706小暑','0722大暑','0807立秋','0822处暑','0907白露','0922秋分','1008寒露','1023霜降','1107立冬','1122小雪','1206大雪','1221冬至']
        let d = new Date();
        let s = '';
        if (d.getMonth() < 9) s +='0';
        s +='' + (d.getMonth() + 1);
        if (d.getDate() < 10) s +='0';
        s +='' + (d.getDate())
        let i = 0
        while (i < jqs.length && s >= jqs[i]) {
          i++
        }
        return {
          name: jqs[i].substr(4),
          date: jqs[i].substr(0, 4),
          currentDate: s
        }
      }
    }
  }
</script>
<style lang="less">
  .solar-term {
    position: fixed;
    bottom: 40px;
    opacity: 0.4;
    left: 50%;
    margin-left: -50px;
    cursor: pointer;
    transition: transform 2.06s;
    &:hover {
      transform: rotate(720deg);
    }
    img {
      width: 100px;
      height: 100px;
    }
  }
</style>
